<nz-modal
  nzTitle="Send a test event"
  i18n-nzTitle="@@integrations.webhooks.send-test-event"
  nzMaskClosable="false"
  [(nzVisible)]="visible"
  (nzOnCancel)="onClose()">
  <div *nzModalContent>
    <p i18n="@@integrations.webhooks.test-webhook-tip">Attempt to deliver an example event to your webhook target.</p>
    <div class="select-event">
      <nz-form-label nzRequired i18n="@@integrations.webhooks.select-an-event">Select an Event</nz-form-label>
      <nz-select nzShowSearch nzAllowClear [(ngModel)]="event">
        <nz-option *ngFor="let event of events" [nzValue]="event" [nzLabel]="event"></nz-option>
      </nz-select>
    </div>
    <nz-skeleton [nzActive]="true" [nzLoading]="isSending">
    </nz-skeleton>
    <ng-container *ngIf="!isSending && delivery">
      <webhook-delivery [delivery]="delivery"></webhook-delivery>
    </ng-container>
  </div>
  <div class="footer" *nzModalFooter>
    <button nz-button nzType="text" (click)="onClose()" i18n="@@common.cancel">Cancel</button>
    <button nz-button nzType="primary" (click)="sendTest()" [nzLoading]="isSending" i18n="@@integration.webhooks.send-test-webhook">Send test webhook</button>
  </div>
</nz-modal>
